<template>
  <div class="container">
    <el-container>
      <el-main>
        <!-- "Partners":{
    "AccumulatedEarning":"累计收益",
    "AccumulatedTransactionAmount":"累计交易额",
    "CurrentPositionAmount":"当前持仓额",
    "NumberOfUsers":"用户数",
    "TradingPage":"交易页面"
  } -->
        <div class="hisP">{{$t('Partners.EarningRank')}}</div>
        <div class="tableDiv">
          <template>
            <el-table
              :data="tableData"
              stripe
              style="width: 100%"
              :header-cell-style="{
                background: '#212432',
                color: '#505363',
                border: '0px solid #2f3241',
                fontSize: '15px'
              }"
              :cell-style="{
                background: '#2f3241',
                border: '0px ',
                fontSize: '13px'
              }"
            >
              <el-table-column>
                <template slot="header" slot-scope="">
                  <el-select
                    v-model="LJvalue"
                    placeholder="累积收益（USDT）"
                    clearable
                    class="LJselect"
                  >
                    <el-option
                      v-for="item in LJoptions"
                      :key="item.value"
                      :label="$t(item.label)"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </template>
                <template slot-scope="scope">
                  <div>
                    {{ scope.row.address }}
                  </div>
                </template>
              </el-table-column>
              <el-table-column prop="name" :label="$t('Partners.AccumulatedTransactionAmount')+'（USDT）'">
              </el-table-column>
              <el-table-column prop="address" :label="$t('Partners.CurrentPositionAmount')+'（USDT）'">
              </el-table-column>
              <el-table-column prop="address" :label="$t('Partners.NumberOfUsers')"> </el-table-column>
              <el-table-column prop="address" :label="$t('Partners.TradingPage')">
              </el-table-column>
            </el-table>
          </template>
        </div>
      </el-main>
      <el-footer>
        <el-pagination background layout="prev, pager, next" :total="100">
        </el-pagination>
      </el-footer>
    </el-container>
  </div>
</template>
<script>
export default {
  data() {
    return {
      LJoptions: [
        {
          value: "1",
          label: 'Partners.AccumulatedEarning'
        }
      ],
      LJvalue: "1",
      tableData: [
        {
          date: "2016-05-02",
          name: "王小虎",
          address: " 1518 弄"
        },
        {
          date: "2016-05-04",
          name: "王小虎",
          address: " 1517 弄"
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: " 1519 弄"
        },
        {
          date: "2016-05-03",
          name: "王小虎",
          address: " 1516 弄"
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: " 1519 弄"
        },
        {
          date: "2016-05-03",
          name: "王小虎",
          address: " 1516 弄"
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: " 1519 弄"
        },
        {
          date: "2016-05-03",
          name: "王小虎",
          address: " 1516 弄"
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: " 1519 弄"
        },
        {
          date: "2016-05-03",
          name: "王小虎",
          address: " 1516 弄"
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: " 1519 弄"
        }
      ]
    };
  }
};
</script>
<style lang="scss" scoped>
.gutter {
  display: block !important;
}
.container {
  max-width: 1107px;
}
.el-table::before,
.el-table--group::after,
.el-table--border::after {
  content: "";
  position: absolute;
  background-color: #2f3241 !important;
}
.el-main {
  // height: 912px;
  background: #13141f;
  overflow: hidden;
  padding-top: 0;
  .hisP {
    width: 1080px;
    font-size: 16px;
    font-family: PingFangSC-Semibold;
    line-height: 25px;
    color: #e2e4ee;
    margin-bottom: 20px;
  }
  .tableDiv {
    height: 545px;
    background: #2f3241;
  }
}
.el-footer {
  height: 43px;
  text-align: right;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
</style>
